<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<style>
			.p1{
				visibility: hidden;
			}
			
			.p2{
				display: none;
			}
			
			li{
				display: inline;
			}
			
			span{
				background-color: aquamarine;
				display: block;
			}
		</style>
	</head>
	<body>
		<!--
		隐藏元素 - display:none或visibility:hidden
		隐藏一个元素可以通过把display属性设置为"none"，或把visibility属性设置为"hidden"。但是请注意，这两种方法会产生不同的结果。
		visibility:hidden可以隐藏某个元素，但隐藏的元素仍需占用与未隐藏之前一样的空间。也就是说，该元素虽然被隐藏了，但仍然会影响布局。
		-->
		<h1 class="p1">aaa</h1>
		<h1 class="p2">bbb</h1>
		
		<!--CSS Display - 块和内联元素-->
		<!--将列表显示为内联元素-->
		<ul>
			<li>1111</li>
			<li>2222</li>
		</ul>
		<!--将span显示为块元素-->
		<span>sssss</span>
	</body>
</html>